import { h } from 'vue'
import { NIcon } from 'naive-ui'
import { cloneDeep } from 'lodash-es'
export function renderIcon(icon: string) {
  return () => {
    return h(NIcon, null, {
      default: () =>
        h('i', {
          class: ['esayIcon', `esayIcon-${icon}`],
        }),
    })
  }
}
const getChilder = (children) => {
  return children
    .filter((el) => {
      return !el.meta.isKeepAlive
    })
    .map((el) => {
      el.title = el.meta.title
      if (el.meta.icon) {
        el.icon = renderIcon(el.meta.icon)
      }
      if (el.children && el.children.length > 0) {
        el.children = getChilder(el.children)
      } else {
        delete el.children
      }
      return el
    })
}
export const getMenuList = (arr) => {
  return cloneDeep(arr)
    .filter((el) => {
      return !el.meta.isKeepAlive
    })
    .map((el) => {
      el.title = el.meta.title
      if (!el.meta.showNext) {
        el.name = el.children[0].name
        el.children = []
      }
      if (el.meta.icon) {
        el.icon = renderIcon(el.meta.icon)
      }
      if (el.children.length > 0) {
        el.children = getChilder(el.children)
      } else {
        delete el.children
      }
      return el
    })
}
